<template>
  <div class="partnerList">
    <div class="partnerList_bottom">
      <div class="partnerList_bottom_new">
        <div class="partnerList_bottom_new_goods">
          <div class="partnerList_bottom_new_goods_btn">
            <button @click="handerNewShop">
              <i class="el-icon-trophy"></i>新增卖场
            </button>
          </div>
          <div class="partnerList_bottom_new_goods_screening">
            <div class="partnerList_bottom_new_goods_screening_right">
              <el-input v-model="input" placeholder="卖场名称"></el-input>
              <button @click="handerSeach">
                <i class="el-icon-search"></i>搜索
              </button>
            </div>
          </div>
        </div>
      </div>
      <div class="partnerList_table">
        <div class="partnerList_bottom_table">
          <table>
            <tr>
              <!--
							<th></th>
							-->
              <th>卖场编号</th>
              <th>名称</th>
              <th>地址</th>
              <th>经度</th>
              <th>纬度</th>
              <th>操作</th>
            </tr>
            <tr v-for="(v, i) in tableList" :key="i">
              <!--
							<td>
								<font class="checkbox" :class="{'check_active' : checkBoxAll.includes(i)}" @click="handlerCheckbox(i)"><i class="el-icon-check"></i></font>
							</td>
							-->
              <td>{{ v.id }}</td>
              <td>{{ v.name }}</td>
              <td>{{ v.address }}</td>
              <td>{{ v.long }}</td>
              <td>{{ v.lat }}</td>
              <td>
                <button class="editor" @click="toDetail(v.id)">详情</button>
                <!--
								<button class="delete"  @click="toDelete(v.id)">删除</button>
								-->
              </td>
            </tr>
            <tr v-if="tableList.length == 0">
              <td class="table_title" colspan="10">当前数据空空如也</td>
            </tr>
          </table>

          <div class="partnerList_bottom_page">
            <div class="partnerList_bottom_page_left">
              <!--
							<div class="partnerList_bottom_page_left_checkAll" @click="handerCheckAll">
								<font class="checkbox" :class="{'check_active' : checkAll}"><i class="el-icon-check"></i></font>
							</div>全选
							-->
              <!-- <button class="partnerList_bottom_page_left_btn" @click="selectDel">删除</button> -->
            </div>
            <div class="partnerList_bottom_page_right">
              <el-pagination
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :current-page="page"
                :page-sizes="[10, 20, 30, 40]"
                :page-size="pageSize"
                layout="total, sizes, prev, pager, next, jumper"
                :total="total"
                background
              >
              </el-pagination>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      cateList: [],
      cate: {},
      input: "",
      checkAll: false,
      page: 1,
      pageSize: 10,
      total: 0,
      checkBoxAll: [], // 选中的数据
      shelvesAlls: [],
      tableList: [],
    };
  },
  mounted() {
    this.getConstrList();
  },

  methods: {
    // 获取知识列表
    getConstrList(keyword = "") {
      this.$http
        .post("/api/root/market/index", {
          page: this.page,
          pagesize: this.pageSize,
          keyword,
        })
        .then((res) => {
          console.log(res);
          if (res.code == 1) {
            this.tableList = res.data.list ? res.data.list : [];
            this.total = res.data.total;
          }
        });
    },

    //新增知识按钮
    handerNewShop() {
      this.$router.push({ path: "/marketDetail" });
    },

    // 类型
    handerChange() {},

    // 搜索
    handerSeach() {
      this.getConstrList(this.input);
    },

    // 点击详情
    toDetail(id) {
      this.$router.push({ name: "marketDetail", query: { id } });
    },

    // 点击删除
    toDelete(id) {
      this.$confirm(
        "此操作将删除此知识（关联的下级知识不会被删除）, 是否继续?",
        "提示",
        {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        }
      ).then(() => {
        this.$http.post("/api/root/kefuAuto/del", { id: str }).then((res) => {
          console.log(res);
          if (res.code == 1) {
            this.getConstrList();
            this.checkAll = false;
            this.checkBoxAll = [];
            this.shelvesAlls = [];
            this.$message({
              type: "success",
              message: "删除成功",
            });
          }
        });
      });
    },
    /*
         // 多选
			handlerCheckbox(i){
                console.log(i);
				let arr = this.checkBoxAll;
				if(arr.includes(i)){
					let index = arr.indexOf(i);
					if(index != -1){
						arr.splice(index,1);
						this.shelvesAlls.splice(index,1);
						if(this.checkBoxAll.length !== this.tableList.length) {
							this.checkAll = false;
						}
					}
				}else {
					this.checkBoxAll.push(i);
					this.shelvesAlls.push(this.tableList[i].id);
					if(this.checkBoxAll.length == this.tableList.length) {
						this.checkAll = true;
					}
				};
				console.log(this.shelvesAlls);
			},
            // 全选与全不选
			handerCheckAll(){
				this.checkAll = !this.checkAll;
				let arr = this.tableList.length;
				this.checkBoxAll = [];
				this.shelvesAlls = [];
				if(this.checkAll){
					for(let i=0;i<arr;i++){
						this.checkBoxAll.push(i);
					}
					this.checkBoxAll.map(v => {
					this.shelvesAlls.push(this.tableList[v].id.toString());;
				})
				}else {
					this.checkBoxAll = [];
					this.shelvesAlls = []
				}
				console.log(this.shelvesAlls);
			},

            // // 全选后的删除
            // selectDel(){
			// 	console.log(this.shelvesAlls);
			// 	let res =[...new Set(this.shelvesAlls)]; //去重
			// 	let str = res.join(',');
			// 	if(this.shelvesAlls.length){
			// 		this.$confirm('此操作将删除选中项, 是否继续?', '提示', {
			// 			confirmButtonText: '确定',
			// 			cancelButtonText: '取消',
			// 			type: 'warning'
			// 		}).then(()=>{
			// 			this.$http.post('/api/root/BuilderTeam/del',{id:str}).then(res=>{
			// 				console.log(res);
			// 				if(res.code==1){
			// 					this.getConstrList();
			// 					this.checkAll=false;
			// 					this.checkBoxAll=[];
			// 					this.shelvesAlls=[];
			// 					this.$message({
			// 						type:'success',
			// 						message:'删除成功'
			// 					})
			// 				}
			// 			})
			// 		})
			// 	}else{
			// 		this.$message({
			// 			type:'info',
			// 			message:'请选择要删除的项'
			// 		})
			// 	}
			// },
			*/

    handleSizeChange(val) {
      this.pageSize = val;
      this.getConstrList();
    },
    handleCurrentChange(val) {
      this.page = val;
      this.getConstrList();
    },
  },
};
</script>

<style lang="less" scoped>
@import "marketList.less";
</style>
